<script lang="ts" setup>
import apply from '@/api/apply'

const props = defineProps({
  placeholder: {
    type: String,
    default: '请选择地址',
  },
  disabled: {
    type: Boolean,
    default: false,
  },
})
const model = defineModel({ type: String })
const longitude = defineModel('longitude', { type: Number })
const latitude = defineModel('latitude', { type: Number })

// async function addressToTude (address: string) {
//   initing.value = true
//   const { data } = await apply.getTude(address)
//   if (data?.status === 'success') {
//     initing.value = false
//     latitude.value = data?.data.latitude
//     longitude.value = data?.data.longitude
//   }
// }

const initingText = '初始化中'
const outputText = ref('')
const initing = ref<boolean>(false)

// 加载中就显示加载文字
watch(() => initing.value, (value) => {
  if (value) {
    outputText.value = initingText
  }
  else {
    if (model.value) {
      outputText.value = model.value
    }
    else {
      outputText.value = ''
    }
  }
})

onMounted(() => {
  if (model.value) {
    // 若外部已有值，则逆编码获取经纬度，用于点开选位置时初始化位置
    // addressToTude(model.value)
    outputText.value = model.value
  }
  else {
    // const { data } = await apply.getAddress(`${lat}`, `${lon}`)
    // if (data?.status === 'success') {
    //   initing.value = false
    //   model.value = data.data.address
    //   latitude.value = lat
    //   longitude.value = lon
    //   emits('change', {
    //     city: data.data.bizAddrCity,
    //     dist: data.data.bizAddrDist,
    //     prov: data.data.bizAddrProv,
    //     area: data.data.businessArea,
    //   })
    // }
  }
})

watch(() => model.value, (value, oldValue) => {
  // 从外面赋值才做逆运算，初始化经纬度
  if (oldValue === '') {
    // addressToTude(value)
    outputText.value = model.value
  }
})

function chooseLocation() {
  if (!props.disabled) {
    initing.value = true
    const option: any = {
      success: async (res) => {
        model.value = res.address
        longitude.value = res.longitude
        latitude.value = res.latitude
        const { data } = await apply.getAddress(`${res.latitude}`, `${res.longitude}`)
        if (data?.status === 'success') {
          initing.value = false
          // 如果微信地址选取组件返回为空，则用后端接口反的地址
          if (res.address === '') {
            model.value = data.data.address
          }
        }
      },
      fail: (err) => {
        if (err.errMsg === 'chooseLocation:fail cancel') {
          initing.value = false
        }
        else {
          console.log('wx.chooseLocation fail')
          console.log(err)
          console.log(err.errMsg)
          console.log(err.errMsg === 'chooseLocation:fail cancel')
        }
      },
    }
    if (longitude.value !== 0 || latitude.value !== 0) {
      option.longitude = longitude.value
      option.latitude = latitude.value
    }
    wx.chooseLocation(option)
  }
}
</script>

<template>
  <div class="location-input" @click="chooseLocation">
    <nut-textarea v-model="outputText" :placeholder="props.placeholder" type="text" readonly autosize
      :disabled="props.disabled" text-align="right" placeholder-style="color:#ccc;" max-length="30" />
  </div>
</template>
<style lang="sass" scoped>
:deep(.nut-textarea__textarea)
  text-align: right!important
</style>